{{! -------------------------------------------------------------------------- }}
{{! Copyright 2002-2023, OpenNebula Project, OpenNebula Systems                }}
{{!                                                                            }}
{{! Licensed under the Apache License, Version 2.0 (the "License"); you may    }}
{{! not use this file except in compliance with the License. You may obtain    }}
{{! a copy of the License at                                                   }}
{{!                                                                            }}
{{! http://www.apache.org/licenses/LICENSE-2.0                                 }}
{{!                                                                            }}
{{! Unless required by applicable law or agreed to in writing, software        }}
{{! distributed under the License is distributed on an "AS IS" BASIS,          }}
{{! WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.   }}
{{! See the License for the specific language governing permissions and        }}
{{! limitations under the License.                                             }}
{{! -------------------------------------------------------------------------- }}
<form data-abide novalidate id="{{formPanelId}}Wizard" class="custom creation">
  <div class="row">
    <div class="medium-6 columns">
      <label for="NAME">
        {{tr "Name"}}
      </label>
      <input id="NAME" type="text" wizard_field="NAME" required/>
    </div>
    <div class="medium-3 columns">
      <label for="TYPE">{{tr "Type"}}</label>
      <select id="TYPE" wizard_field="TYPE" required>
        <option value="image">{{tr "Image"}}</option>
        <option value="vm">{{tr "VM"}}</option>
        <option value="vmtemplate">{{tr "VM Template"}}</option>
        <option value="service_template">{{tr "Service Template"}}</option>
      </select>
    </div>
    <div class="medium-3 columns">
    </div>
  </div>
  <div id="importAllCheckBox" class="row">
    <div class="medium-6 columns">
      <input type="checkbox" id="IMPORT_ALL" wizard_field="IMPORT_ALL"></textarea>
      <label for="IMPORT_ALL">
        {{tr "Import images"}}
      </label>
    </div>
  </div>

  <!-- START IMAGES/SERVICES/VMTEMPLATES/VM TABLES -->

  <div id="servicesTableHTML">
    <div class="row">
      <fieldset>
        <legend>{{tr "Select the Service to create the App"}}</legend>
        {{{servicesTableHTML}}}
      </fieldset>
    </div>
    <div id="serviceMarketPlaceError" class="row oneflow_templates_error_message" style="padding-bottom: 2em; display: none;">
      <div class="small-6 columns small-centered text-center">
          <div class="label alert radius">{{tr "Cannot connect to OneFlow server"}}</div>
      </div>
    </div>
  </div>
  
  <fieldset id="templatesTableHTML">
    <legend>{{tr "Select the VM Template to create the App"}}</legend>
    {{{templatesTableHTML}}}
  </fieldset>
  
  <fieldset id="imagesTableHTML">
    <legend>{{tr "Select the Image to create the App"}}</legend>
    {{{imagesTableHTML}}}
  </fieldset>

  <fieldset id="vmsTableHTML">
    <legend>{{tr "Select the VM to create the App"}}</legend>
    {{{vmsTableHTML}}}
  </fieldset>

  <!-- END IMAGES/SERVICES/VMTEMPLATES/VM TABLES -->

  <!-- START MARKETPLACES TABLES -->
  <fieldset id="serviceMarketPlaceHTML">
    <legend>{{tr "Select the Marketplace where the Images will be created"}}</legend>
    {{{marketPlacesServicesTableHTML}}}
  </fieldset>
  
  <fieldset id="appMarketPlaceHTML">
    <legend>{{tr "Select the Marketplace where where the App will be created"}}</legend>
    {{{marketPlacesImagesTableHTML}}}
  </fieldset>

  <!-- END MARKETPLACES TABLES -->
  
  <fieldset id="templatesForApp">
  <legend>{{tr "Templates for the App"}}</legend>
  <div class="row">
    <div class="medium-6 columns">
      <label for="VMTEMPLATE">
        {{tr "VM template"}}
        {{{tip (tr "VM Template to be created. A DISK element pointing to the App Image will be automatically added when the App is exported")}}}
      </label>
      <textarea class="monospace" id="VMTEMPLATE" rows="4" wizard_field="VMTEMPLATE64" wizard_field_64="true" placeholder='ATTRIBUTE = "VALUE"'></textarea>
    </div>
    <div class="medium-6 columns">
      <label for="APPTEMPLATE">
        {{tr "App template"}}
      </label>
      <textarea class="monospace" id="APPTEMPLATE" rows="4" wizard_field="APPTEMPLATE64" wizard_field_64="true" placeholder='ATTRIBUTE = "VALUE"'></textarea>
    </div>
  </div>
  </fieldset>
</form>